<template>
  <main class="supplier-system">
    <div class="min-pc-width system">
      <p class="header"><span>第2页</span></p>
      <!-- <a-form :form="form" @submit="handleSubmit"> -->
      <a-form :form="form" @submit="handleSubmit">
        <p class="content mt20">科研成果 </p>
        <p class="rcolor mt20">上传文件大小均不能超过5M</p>
        <a-form-item label="立项文件或任务书(支持图片、PDF、office文件且文件大小不超过5M)" class="form-item" >
          <a-row :gutter="24">
            <a-col :span="20">
                <div class="from-item-input">
                    <span>{{file.lxrwfile}}<a-icon class="tip" type="close" @click="deleteDoc('lxrwfile')" /></span>
                </div>
            </a-col>
            <a-col :span="4">
              <a-upload name="fileName" :action="uploadUrl" :before-upload="beforeUpload" accept=".doc,.docx,.xls,.xlsx,.pdf,.png,.jpg,.jpeg,application/msword,application/vnd.openxmlformats-officedocument.wordprocessingml.document" :headers="headers" :showUploadList="false" @change="handleChange($event, 'lxrwfile')">
                <a-button  type="primary" class="ss-btn">上传附件</a-button>
              </a-upload>
            </a-col>
          </a-row>
        </a-form-item>
        <a-form-item label="技术报告(支持图片、PDF、office文件且文件大小不超过5M)" class="form-item" >
          <a-row :gutter="24">
            <a-col :span="20">
                <div class="from-item-input">
                    <span>{{file.jsbgaofile}}<a-icon class="tip" type="close" @click="deleteDoc('jsbgaofile')" /></span>
                </div>
            </a-col>
            <a-col :span="4">
              <a-upload name="fileName" :action="uploadUrl" :before-upload="beforeUpload" accept=".doc,.docx,.xls,.xlsx,.pdf,.png,.jpg,.jpeg,application/msword,application/vnd.openxmlformats-officedocument.wordprocessingml.document" :headers="headers" :showUploadList="false" @change="handleChange($event, 'jsbgaofile')">
                <a-button  type="primary" class="ss-btn">上传附件</a-button>
              </a-upload>
            </a-col>
          </a-row>
        </a-form-item>
        <a-form-item label="成果评价证书(支持图片、PDF、office文件且文件大小不超过5M)" class="form-item" >
          <a-row :gutter="24">
            <a-col :span="20">
                <div class="from-item-input">
                    <span>{{file.cgjdzsfile}}<a-icon class="tip" type="close" @click="deleteDoc('cgjdzsfile')" /></span>
                </div>
            </a-col>
            <a-col :span="4">
              <a-upload name="fileName" :action="uploadUrl" :before-upload="beforeUpload" accept=".doc,.docx,.xls,.xlsx,.pdf,.png,.jpg,.jpeg,application/msword,application/vnd.openxmlformats-officedocument.wordprocessingml.document" :headers="headers" :showUploadList="false" @change="handleChange($event, 'cgjdzsfile')">
                <a-button  type="primary" class="ss-btn">上传附件</a-button>
              </a-upload>
            </a-col>
          </a-row>
        </a-form-item>
        <a-form-item label="应用证明和效益证明(支持图片、PDF、office文件且文件大小不超过5M)" class="form-item" >
          <a-row :gutter="24">
            <a-col :span="20">
                <div class="from-item-input">
                    <span>{{file.yyzmxyzmfile}}<a-icon class="tip" type="close" @click="deleteDoc('yyzmxyzmfile')" /></span>
                </div>
            </a-col>
            <a-col :span="4">
              <a-upload name="fileName" :action="uploadUrl" :before-upload="beforeUpload" accept=".doc,.docx,.xls,.xlsx,.pdf,.png,.jpg,.jpeg,application/msword,application/vnd.openxmlformats-officedocument.wordprocessingml.document" :headers="headers" :showUploadList="false" @change="handleChange($event, 'yyzmxyzmfile')">
                <a-button  type="primary" class="ss-btn">上传附件</a-button>
              </a-upload>
            </a-col>
          </a-row>
        </a-form-item>
        <a-form-item label="知识产权证明文件(支持图片、PDF、office文件且文件大小不超过5M)" class="form-item" >
          <a-row :gutter="24">
            <a-col :span="20">
                <div class="from-item-input">
                    <span>{{file.zscqzmfile}}<a-icon class="tip" type="close" @click="deleteDoc('zscqzmfile')" /></span>
                </div>
            </a-col>
            <a-col :span="4">
              <a-upload name="fileName" :action="uploadUrl" :before-upload="beforeUpload" accept=".doc,.docx,.xls,.xlsx,.pdf,.png,.jpg,.jpeg,application/msword,application/vnd.openxmlformats-officedocument.wordprocessingml.document" :headers="headers" :showUploadList="false" @change="handleChange($event, 'zscqzmfile')">
                <a-button  type="primary" class="ss-btn">上传附件</a-button>
              </a-upload>
            </a-col>
          </a-row>
        </a-form-item>
        <a-form-item label="获奖证明(支持图片、PDF、office文件且文件大小不超过5M)" class="form-item" >
          <a-row :gutter="24">
            <a-col :span="20">
                <div class="from-item-input">
                    <span>{{file.hjzmfile}}<a-icon class="tip" type="close" @click="deleteDoc('hjzmfile')" /></span>
                </div>
            </a-col>
            <a-col :span="4">
              <a-upload name="fileName" :action="uploadUrl" :before-upload="beforeUpload" accept=".doc,.docx,.xls,.xlsx,.pdf,.png,.jpg,.jpeg,application/msword,application/vnd.openxmlformats-officedocument.wordprocessingml.document" :headers="headers" :showUploadList="false" @change="handleChange($event, 'hjzmfile')">
                <a-button  type="primary" class="ss-btn">上传附件</a-button>
              </a-upload>
            </a-col>
          </a-row>
        </a-form-item>
        <p class="content mt20">BIM成果 </p>
        <a-form-item label="BIM技术应用总结(支持图片、PDF、office文件且文件大小不超过5M)" class="form-item" >
          <a-row :gutter="24">
            <a-col :span="20">
                <div class="from-item-input">
                    <span>{{file.bimyyzjiefile}}<a-icon class="tip" type="close" @click="deleteDoc('bimyyzjiefile')" /></span>
                </div>
            </a-col>
            <a-col :span="4">
              <a-upload name="fileName" :action="uploadUrl" :before-upload="beforeUpload" accept=".doc,.docx,.xls,.xlsx,.pdf,.png,.jpg,.jpeg,application/msword,application/vnd.openxmlformats-officedocument.wordprocessingml.document" :headers="headers" :showUploadList="false" @change="handleChange($event, 'bimyyzjiefile')">
                <a-button  type="primary" class="ss-btn">上传附件</a-button>
              </a-upload>
            </a-col>
          </a-row>
        </a-form-item>
        <a-form-item label="模型文件目录(支持图片、PDF、office文件且文件大小不超过5M)" class="form-item" >
          <a-row :gutter="24">
            <a-col :span="20">
                <div class="from-item-input">
                    <span>{{file.mxwjmlfile}}<a-icon class="tip" type="close" @click="deleteDoc('mxwjmlfile')" /></span>
                </div>
            </a-col>
            <a-col :span="4">
              <a-upload name="fileName" :action="uploadUrl" :before-upload="beforeUpload" accept=".doc,.docx,.xls,.xlsx,.pdf,.png,.jpg,.jpeg,application/msword,application/vnd.openxmlformats-officedocument.wordprocessingml.document" :headers="headers" :showUploadList="false" @change="handleChange($event, 'mxwjmlfile')">
                <a-button  type="primary" class="ss-btn">上传附件</a-button>
              </a-upload>
            </a-col>
          </a-row>
        </a-form-item>
        <a-form-item label="效益证明(支持图片、PDF、office文件且文件大小不超过5M)" class="form-item" >
          <a-row :gutter="24">
            <a-col :span="20">
                <div class="from-item-input">
                    <span>{{file.xiaoyizmfile}}<a-icon class="tip" type="close" @click="deleteDoc('xiaoyizmfile')" /></span>
                </div>
            </a-col>
            <a-col :span="4">
              <a-upload name="fileName" :action="uploadUrl" :before-upload="beforeUpload" accept=".doc,.docx,.xls,.xlsx,.pdf,.png,.jpg,.jpeg,application/msword,application/vnd.openxmlformats-officedocument.wordprocessingml.document" :headers="headers" :showUploadList="false" @change="handleChange($event, 'xiaoyizmfile')">
                <a-button  type="primary" class="ss-btn">上传附件</a-button>
              </a-upload>
            </a-col>
          </a-row>
        </a-form-item>
        <a-form-item label="获奖证明(支持图片、PDF、office文件且文件大小不超过5M)" class="form-item" >
          <a-row :gutter="24">
            <a-col :span="20">
                <div class="from-item-input">
                    <span>{{file.huojiazmfile}}<a-icon class="tip" type="close" @click="deleteDoc('huojiazmfile')" /></span>
                </div>
            </a-col>
            <a-col :span="4">
              <a-upload name="fileName" :action="uploadUrl" :before-upload="beforeUpload" accept=".doc,.docx,.xls,.xlsx,.pdf,.png,.jpg,.jpeg,application/msword,application/vnd.openxmlformats-officedocument.wordprocessingml.document" :headers="headers" :showUploadList="false" @change="handleChange($event, 'huojiazmfile')">
                <a-button  type="primary" class="ss-btn">上传附件</a-button>
              </a-upload>
            </a-col>
          </a-row>
        </a-form-item>
        <div class="supplier-footer">
          <a-button @click="goBack" class="s-btn">
            返回
          </a-button>
          <a-button html-type="submit"  class="s-btn"  @click="save">
          <!-- <a-button html-type="submit" class="s-btn"> -->
            保存
          </a-button>
          <a-button @click="resetForm" class="s-btn">
            重填
          </a-button>
          <a-button  type="primary" html-type="submit"  @click="goNext" class="s-btn">
            提交
          </a-button>
        </div>
    </a-form>
    </div>
  </main>
</template>
<script>
export default {
  data () {
    return {
      currentIndex: 0,
      form: this.$form.createForm(this),
      headers: {
        authorization: 'authorization-text'
      },
      formId: '',
      type: 0,
      formData: '',
      uploadUrl: `${process.env.VUE_APP_URL}/main/upload`,
      file: {
        lxrwfile: '',
        jsbgaofile: '',
        cgjdzsfile: '',
        yyzmxyzmfile: '',
        zscqzmfile: '',
        hjzmfile: '',
        bimyyzjiefile: '',
        mxwjmlfile: '',
        xiaoyizmfile: '',
        huojiazmfile: ''
      }
    }
  },
  components: {
  },
  computed: {
  },
  created () {
    if (this.$route.query.id) {
      this.formId = this.$route.query.id
      this.getKJCXFormDataById()
    }
  },
  methods: {
    goBack () {
      this.$router.push({ path: `/innovation/create/1?id=${this.formId}` })
    },
    goNext () {
      this.type = 1
    },
    save () {
      this.type = 0
    },
    beforeUpload (file) {
      if (file.size > 5242880) {
        this.$message.warning("文件大小不能超过5M")
        return false
      }
    },
    deleteDoc (key) {
      this.file[key] = ''
    },
    getKJCXFormDataById () {
      this.$http.getKJCXFormDataById({ id: this.formId }).then(res => {
        this.formData = res.data
        this.file = {
          lxrwfile: res.data.lxrwfile,
          jsbgaofile: res.data.jsbgaofile,
          cgjdzsfile: res.data.cgjdzsfile,
          yyzmxyzmfile: res.data.yyzmxyzmfile,
          zscqzmfile: res.data.zscqzmfile,
          hjzmfile: res.data.hjzmfile,
          bimyyzjiefile: res.data.bimyyzjiefile,
          mxwjmlfile: res.data.mxwjmlfile,
          xiaoyizmfile: res.data.xiaoyizmfile,
          huojiazmfile: res.data.huojiazmfile
        }
      })
    },
    memberStepForm (values) {
      if (!this.file.lxrwfile) {
        this.$message.warning(`请上传立项文件或任务书`)
        return false
      }
      if (!this.file.jsbgaofile) {
        this.$message.warning(`请上传技术报告`)
        return false
      }
      if (!this.file.cgjdzsfile) {
        this.$message.warning(`请上传成果评价证书`)
        return false
      }
      if (!this.file.yyzmxyzmfile) {
        this.$message.warning(`请上传应用证明和效益证明`)
        return false
      }
      if (!this.file.zscqzmfile) {
        this.$message.warning(`请上传知识产权证明文件`)
        return false
      }
      if (!this.file.hjzmfile) {
        this.$message.warning(`请上传获奖证明`)
        return false
      }
      if (!this.file.bimyyzjiefile) {
        this.$message.warning(`请上传BIM成果`)
        return false
      }
      if (!this.file.mxwjmlfile) {
        this.$message.warning(`请上传模型文件目录`)
        return false
      }
      if (!this.file.xiaoyizmfile) {
        this.$message.warning(`请上传效益证明`)
        return false
      }
      if (!this.file.huojiazmfile) {
        this.$message.warning(`请上传获奖证明`)
        return false
      }
      Object.assign(values, this.file, { id: this.formId })
      let _this = this
      if (!this.type) {
        _this.$http.submitKJCXForm(Object.assign(values, { id: this.formId })).then(res => {
        })
      } else {
        this.showDialog({
          title: '提示',
          msg: '确认提交吗',
          lBtnText: '取消',
          rBtnText: '确认',
          confCallBack () {
            _this.$http.submitKJCXForm(values).then(res => {
              _this.$http.submitKejichxinForm({ id: _this.formId }).then(res => {
                // _this.$message.success(`提交成功，等待审核`)
                _this.$router.push({ path: '/innovation/create/final' })
              })
            })
          }
        })
      }
    },
    handleChange (info, key) {
      if (info.file.status === "done") {
        this.file[key] = info.file.response.fileName
      } else if (info.file.status === "error") {
        this.$message.error(`${info.file.name} file upload failed.`)
      }
    },
    handleSubmit (e) {
      let _this = this
      e.preventDefault()
      this.form.validateFields((err, values) => {
        if (!err) {
          _this.memberStepForm(values)
        }
      })
    },
    resetForm () {
      this.form.resetFields()
    }
  }
}
</script>
<style lang="scss">
</style>
